<script setup>
import Article from '../api/getArticleById.js'
import editorWim from './editor.vue'
import articlesSet from './articlesSet.vue'
import { useUserStore } from '../stores/user.js'
import getUser  from "../api/getuser.js"
import router from "@/router/index";
import isAdmin  from '../api/isAdmin';
import { useRoute } from 'vue-router'
import load from './load.vue'
const route = useRoute()

const urlParams = new URLSearchParams(window.location.search);

const article_Id = ref("")
import {ref , onBeforeMount} from "vue"
import getArticle from '../api/blurredArticles'

const userInform = useUserStore();
const flag = ref(true)
const loading = ref(true)
const an_state = ref(false)

function setFlag() {
  flag.value = false
}

onBeforeMount(()=>{
    isAdmin().then((res)=>{
        if(res.status = 200)
        an_state.value= true
    })
    article_Id.value  = urlParams.get('article');
    console.log(article_Id.value)
    if(article_Id.value == null){
      article_Id.value = sessionStorage.getItem("article_id")
    }
    if (article_Id.value != null && article_Id.value.trim != "") {
      
      Article(article_Id.value).then((res)=>{
        if(res.status == 200)
        {
          console.log(res.data)
          if(res.data.userId==localStorage.getItem("user_id") || an_state)
          {
                  flag.value = false
          }
        }
      })

    }
})

getUser().then(function (response) {
        if(response.status == 200)
        {
        userInform.userId = response.data.userId ;
        userInform.username = response.data.userName ;
        userInform.image = response.data.imageId;
        userInform.article =  response.data.articleId ;
        loading.value = false
        }

        })
setTimeout(() => {
        if(loading.value == true)
        {
          localStorage.removeItem("jwttoken");
            localStorage.removeItem("userId");
            ElMessage({
            showClose: true,
            message: '你并没有登录，所以不能编辑文章',
            type: 'warning',
            })
            router.back()
        }
    }, 2000);
</script>

<template>

<div v-if="loading">
  <load></load>
</div>

<div class="top_box" v-else>
  <div class="set_box" v-if="flag">
  <articlesSet :value = "flag" @setFlag = "setFlag"></articlesSet>
  </div>
  <div class="editor-box" v-else="flag">
  <editorWim :article="article_Id"></editorWim>
  </div>
</div>
</template>

<style>
    .editor-box{  
      width: 75%;
      height: 80%;
      margin-left: 12.5%;
      position: relative;
      top:8vh;
    }
    
    .top_box{
      height: 100vh;
      width: 100vw;
      background-color: bisque;
    }

    .set_box {
      height: 100vh;
      width: 100vw;
      position: relative;
    }

</style>